const subjectList = [];

var recordStr = "";

$(function () {

    // 读取缓存 & 初始化
    loadCache();

    // 点击编辑题号
    $("#edit-subject").on("click", editSubject);

    // 题号输入控制
    $(".subject-edit").on("keydown", "input", inputControl);

    // 点击确定题号
    $("#confirm-subject").on("click", confirmSubject);

    // 点击删除题号
    $(".subject-edit").on("click", ".input-group-append", deleteSubject);

    // 点击上移
    $(".subject-edit").on("click", ".btn-light", moveUpBtn);

    // 点击下移
    $(".subject-edit").on("click", ".btn-dark", moveDownBtn);

    // 点击清空题号
    $("#clear-subject").on("click", clearSubject);

    // 点击新增题号
    $("#add-subject").on("click", addSubject);

    // 清除记录
    $("#clear-record").on("click", clearRecord);

    // 点击统计
    $("#count-btn").on("click", countSubject);

    // 撤销一次
    $("#revoke-btn").on("click", revokeRecord);

    // 点击题号
    $(".subject-btn-list").on("click", ".btn", clickSubject);

})

// 读取缓存
function loadCache() {
    // 初始化隐藏


    // 读取错误记录
    var recordStrCache = localStorage.getItem("recordStr");
    if (recordStrCache != null) {
        recordStr = recordStrCache;
        renderRecord();
        countSubject();
    } else {
        $(".subject-record").hide();
        $(".result-list").hide();
    }
    // 读取题号记录
    var subjectListCache = localStorage.getItem("subjectList");
    if (subjectListCache != null) {
        Object.assign(subjectList, subjectListCache.split(","));
        renderSubjectList();
        $(".subject-edit").hide();
        $("#confirm-subject").hide();
        renderBtnList();
    } else {
        $("#edit-subject").hide();
        $(".subject-show").hide();
    }

    // 渲染高亮阈值
    $("#high-light-value").val(localStorage.getItem("highlightValue") || 999);

}

// 点击编辑题号
function editSubject(e) {
    console.log("编辑题号", e)
    $(this).hide();
    $("#confirm-subject").show();
    $(".subject-show").hide();
    $(".subject-edit").show();
}

// 题号输入控制
function inputControl(e) {
    if (e.keyCode == "32") {
        e.preventDefault();
    }
}

// 点击确定题号
function confirmSubject(e) {
    console.log("确定题号", e)
    subjectList.length = 0;
    $(".subject-edit").find("input").each(function (index, ele) {
        if ($(ele).val().length > 0) {
            subjectList.push($(ele).val());
        }
    })
    if (subjectList.length == 0) {
        alert("请至少输入一个题号！");
        return;
    }
    localStorage.setItem("subjectList", subjectList);
    renderBtnList();
    $(".subject-show").show();
    $("#edit-subject").show();
    $(this).hide();
    $(".subject-edit").hide();
    $(".subject-record").show();
    // $(".result-list").show();
}

// 点击删除题号
function deleteSubject(e) {
    console.log("删除题号", e)
    if (confirm("确定删除本题？")) {
        $(this).parent().remove();
    }
}

// 点击上移
function moveUpBtn() {
    var $item = $(this).parent();
    if ($item.prev().is(".input-group")) {
        $item.prev().before($item.clone());
        $item.remove();
    }
}

// 点击下移
function moveDownBtn() {
    var $item = $(this).parent();
    if ($item.next().is(".input-group")) {
        $item.next().after($item.clone());
        $item.remove();
    }
}

// 点击清空题号
function clearSubject(e) {
    console.log("清空题号", e)
    if (confirm("确认删除所有题号？")) {
        subjectList.length = 0;
        $("#add-subject").parent().prevAll(".input-group").remove();
        localStorage.removeItem("subjectList");
    }
}

// 点击新增题号
function addSubject(e) {
    console.log("新增题号", e)
    $(this).parent().before(
        '<div class="input-group col-sm-2">' +
        '   <input class="form-control" type="text" />' +
        '   <div class="input-group-append">' +
        '       <a class="input-group-text btn"><i class="fa fa-minus font-red"></i></a>' +
        '   </div>' +
        '   <a class="btn btn-sm btn-light"><i class="fa fa-chevron-up"></i></a>' +
        '   <a class="btn btn-sm btn-dark"><i class="fa fa-chevron-down font-white"></i></a>' +
        '</div>'
    )
    $(this).parent().prev().find("input").focus();
}

// 清除记录
function clearRecord(e) {
    console.log("清除记录", e)
    if (confirm("确认清除记录？将导致之前的输入被清除！")) {
        recordStr = "";
        $(".subject-record").find("textarea").val("");
        localStorage.removeItem("recordStr");
    }
}

// 点击统计
function countSubject(e) {
    console.log("点击统计", e)
    if (recordStr == "") {
        alert("没有错误记录！")
        return;
    }
    var recordList = recordStr.trim().split(" ");
    var itemList = {};
    recordList.forEach(function (v) {
        if (itemList[v] == undefined) {
            itemList[v] = { subject: v, count: 1, index: 0 };
        } else {
            itemList[v].count++;
        }
    })
    // console.log(itemList);
    var sortedList = [];
    for (const key in itemList) {
        sortedList.push(itemList[key]);
    }
    sortedList.sort(function (a, b) {
        return b.count - a.count;
    })
    for (var i = 1; i < sortedList.length + 1; i++) {
        sortedList[i - 1].index = i;
    }
    console.log("sortedList", sortedList)
    // console.log("itemList", itemList)

    var $tbody = $("table").find("tbody");
    $tbody.html("");
    var highlightValue = $("#high-light-value").val() || localStorage.getItem("highlightValue") || 999;
    localStorage.setItem("highlightValue", highlightValue);
    sortedList.forEach(function (item) {
        $tbody.append(
            '<tr ' + (item.count >= highlightValue ? 'class="text-danger font-weight-bold"' : '') + '>' +
            '   <td>' + item.subject + '</td>' +
            '   <td>' + item.count + '</td>' +
            '   <td>' + item.index + '</td>' +
            '</tr>'
        )
    })
    $(".result-list").show();
}

// 撤销一次
function revokeRecord(e) {
    console.log("撤销一次", e)
    if (recordStr.length == 0) {
        alert("无记录可撤销！")
        return;
    }
    if (confirm("确定撤销一次输入吗？")) {
        recordStr = recordStr.slice(0, recordStr.trim().lastIndexOf(" ") + 1);
        localStorage.setItem("recordStr", recordStr);
        renderRecord();
    }
}

// 点击题号
function clickSubject(e) {
    console.log("点击题号", e)
    recordStr += ($(this).text() + " ");
    renderRecord();
    localStorage.setItem("recordStr", recordStr);
    // console.log(recordStr);
}

// 渲染可编辑题号
function renderSubjectList() {
    $(".subject-edit").show();
    $("#add-subject").parent().prevAll(".input-group").remove();
    var $addBtnParent = $("#add-subject").parent();
    subjectList.forEach(function (v) {
        $addBtnParent.before(
            '<div class="input-group col-sm-2">' +
            '   <input class="form-control" type="text" value="' + v + '"/>' +
            '   <div class="input-group-append">' +
            '       <a class="input-group-text btn"><i class="fa fa-minus font-red"></i></a>' +
            '   </div>' +
            '   <a class="btn btn-sm btn-light"><i class="fa fa-chevron-up"></i></a>' +
            '   <a class="btn btn-sm btn-dark"><i class="fa fa-chevron-down font-white"></i></a>' +
            '</div>')
    })
}

// 渲染按钮
function renderBtnList() {
    $(".subject-show").show();
    $(".subject-btn-list").html("");
    subjectList.forEach(function (v) {
        $(".subject-btn-list").append(
            '<a class="btn btn-outline-primary btn-larger">' + v + '</a>'
        );
    })
}

// 渲染记录
function renderRecord() {
    $(".subject-record").show();
    $(".subject-record").find("textarea").val(recordStr);
}




